<template>
  <div class="course" style="display: flex;flex-wrap: wrap;">
    <div class="course_part" v-for="item in Info">
      <router-link to="">
        <div class="course_show">
          <img :src="item.picture" height="191" width="325"/>
        </div>
      </router-link>
      <p><strong>{{item.name}}</strong></p>
      <p><span>{{item.grade}}</span>
        <span>{{item.apparatus}}</span>
        <span>{{item.bodypart}}</span>
      </p>
      <div class="shanchu">
        <el-button type="text" class="button">删除</el-button>
      </div>
    </div>
  </div>
</template>
<script>
  // import Bus from '../../Bus'
  export default {
      name: "Usercord",
      data(){
          return{
            Info:{"img_url":require('../../img/四足俯卧撑.png'),"name":"四足俯卧撑","grade":"低级","apparatus":"杠铃","bodypart":"前臂"}
          }
      },

      components:{
      },
      created() {
        var telephone=this.$store.state.telephone
        var this_=this
        this.$axios.get('http://127.0.0.1:8080/record/myrecords', {
          params: {
            telephone:telephone
          }
        })
          .then(function (response) {
            this_.Info=response.data
            // console.log(this_.Info[0])
            // console.log(this_.Info[0].portrait);
            // Bus.$emit('portrait',this_.$store.state.user_info[0].portrait)
          })
          .catch(function (error) {
            console.log(error);
          });


      }
    }
</script>

<style scoped>
  .course_part{
    /*background: #33ff12;*/
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: 0.5s;
    margin-left: 8px;
    /*box-sizing: border-box;*/
  }
  .course_part .course_show:hover{
    box-shadow: 0px 0px 10px gray;
    /*transform: translate(0px,-5px);*/
  }
  a{
    text-decoration: none;
    color: black;
  }
  span{
    font-family: "SimHei";
  }
  .shanchu{
    float: right;
    margin-top: -25px;
  }
  .shanchu .button:hover{
    color: red;
  }
</style>
